<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>动画</title>
        <style>
            * {
                margin: 0;
                padding: 0;
            }
            h2 {
                background-color: orange;
            }
            @keyframes atguigu {
                from{
                    transform: translateX(0px);
                }
                to{
                    transform: translateX(-100%);
                }
            }
            .come {
                animation: 1s atguigu linear reverse;
            }
            .go {
                animation: 1s atguigu linear;
                animation-fill-mode: forwards;
            }
        </style>
    </head>
    <body>
        <h2>你好啊</h2>
    </body>
</html>